// Create a YUI instance and request the slider module and its dependencies
YUI({ filter: 'raw' }).use("slider", function (Y) {
 
var thicknessInput, 
    colorInput, 
    thicknessSlider,
	colorSlider; 
 
// Function to pass input value back to the Slider

 
// Function to update the input value from the Slider value
function updateInput( e ) {
    this.set( "value", e.newVal );
}
 
 
 
// Create a vertical Slider to thickness
thicknessSlider = new Y.Slider({
				axis: 'y',
				length: '80px',
				min: 1,
		        max: 10,
		        value: 5
			});
 
// Link the input value to the Slider
thicknessInput = Y.one( "#thickness" );
thicknessInput.setData( { slider: thicknessSlider } );
 
// Pass the input as the third arg to be 'this' inside updateInput
thicknessSlider.after( "valueChange", updateInput, thicknessInput );
 
// Render the Slider next to the input
thicknessSlider.render('.vertical_slider_thickness');
 




// Create a vertical Slider to color
colorSlider = new Y.Slider({
				axis: 'y',
                length: '80px',
                min: 1,
                max: 3,
                value: 2
            });
 
// Link the input value to the Slider
colorInput = Y.one( "#color" );
colorInput.setData( { slider: colorSlider } );
 
// Pass the input as the third arg to be 'this' inside updateInput
colorSlider.after( "valueChange", updateInput, colorInput );
 
// Render the Slider next to the input
colorSlider.render('.vertical_slider_color');





 
});